<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/security/tags" prefix="security"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" href="<c:url value="/resources/css/bootstrap.css" />">
<link rel="stylesheet" href="<c:url value="/resources/css/bootstrap-theme.css" />">
<link rel="stylesheet" href="<c:url value="/resources/css/carousel.css" />">
<link rel="stylesheet" href="<c:url value="/resources/css/jquery.dataTables.css" />">
<link rel="stylesheet" href="<c:url value="/resources/css/jquery.dataTables_themeroller.css" />">
<link rel="stylesheet" href="<c:url value="/resources/css/easydropdown.css" />">

<script type="text/javascript" src="<c:url value="/resources/js/jquery-2.1.1.js" />"></script>
<script type="text/javascript" src="<c:url value="/resources/js/bootstrap.js"/>"></script>
<script type="text/javascript" src="<c:url value="/resources/js/jquery.dataTables.js" />"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$("#tableCustomer").dataTable();
		$("#tableAccount").dataTable();
		$("#tableTransaction").dataTable();
		$("#tableCard").dataTable();
	});
</script>

<script type="text/javascript">
	function checkInbox(){
		$.ajax({
			url: '<c:url value="/checkInbox/ajax" />',
			type: 'get',
			success: function(i){
				$("#inbox").html(i);
			}
		});
	}
</script>
<script type="text/javascript">
	var intervalId = 0;
	imtervalId = setInterval(checkInbox,5000);
</script>

<title>Admin Page</title>
</head>
<body>
	<div class="container">

      <!-- Static navbar -->
      <div class="navbar navbar-default" role="navigation">
        <div class="container-fluid">
          <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
              <span class="sr-only">Toggle navigation</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="<c:url value="/" />">DAO JPA</a>
          </div>
          <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
              <li><a href="<c:url value="/" />">Home</a></li>
              <security:authorize access="hasRole('ROLE_ADMIN')">
              <li class="active"><a href="<c:url value="/adminpage"/>">Admin Page</a></li>
              </security:authorize>
              <security:authorize access="isAuthenticated()">
              <li><a href="<c:url value="/profile"/>">Profile</a></li>
              <li><a href="<c:url value="/account"/>">Accounts</a></li>
              <li><a href="<c:url value="/card"/>">Cards</a></li>
              <li><a href="<c:url value="/transfer"/>">Transfer</a></li>
              </security:authorize>
              <security:authorize access=" !isAuthenticated()">
              <li><a href="<c:url value="/login"/>">Login</a></li>
              </security:authorize>
              <li><a href="<c:url value="/register"/>">Register</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
            	<security:authorize access=" isAuthenticated()">
            	<li><a>Welcome ${pageContext.request.userPrincipal.name}</a></li>
            	<li><a href="<c:url value="/checkInbox"/>">Inbox <span class="badge"><div id="inbox">0</div></span></a></li>
            	<li><a href="<c:url value="/logout"/>">Logout</a></li>
            	</security:authorize>
            </ul>
          </div><!--/.nav-collapse -->
        </div><!--/.container-fluid -->
      </div>
    </div> <!-- /container -->
    
     <div class="container">
     	<h2 class="text-success text-center">List Customer</h2>
    	<table class="table table-striped table-bordered table-hover" id="tableCustomer">
    		<thead>
	    		<tr>
	    			<th>Login Id</th>
	    			<th>Password</th>
	    			<th>First Name</th>
	    			<th>Last Name</th>
	    			<th>Address</th>
	    			<th>Phone</th>
	    		</tr>
    		</thead>
    		<tbody>
    			<c:forEach var="customer" items="${customers}">
    				<tr>
    					<td>${customer.loginId}</td>
    					<td>${customer.password.substring(1,5)}</td>
    					<td>${customer.firstname}</td>
    					<td>${customer.lastname}</td>
    					<td>${customer.address}</td>
    					<td>${customer.phone}</td>
    				</tr>
    			</c:forEach>
    		</tbody>
    	</table>
     
    	<h2 class="text-info text-center">List Account</h2>
    	<table class="table table-striped table-bordered table-hover" id="tableAccount">
    		<thead>
	    		<tr>
	    			<th>Account Type</th>
	    			<th>Account Number</th>
	    			<th>Account Name</th>
	    			<th>Owner Account</th>
	    			<th>Available Amount</th>
	    		</tr>
    		</thead>
    		<tbody>
    			<c:forEach var="account" items="${accounts}">
    				<tr>
    					<td>${account.accountType}</td>
    					<td>${account.number}</td>
    					<td>${account.accountName}</td>
    					<td>${account.customer.loginId}</td>
    					<td>${account.amount}</td>
    				</tr>
    			</c:forEach>
    		</tbody>
    	</table>
    	
    	<h2 class="text-warning text-center">List Card</h2>
    	<table class="table table-striped table-bordered table-hover" id="tableCard">
    		<thead>
	    		<tr>
	    			<th>Card Type</th>
	    			<th>Card Number</th>
	    			<th>Owner Card</th>
	    			<th>Available Amount</th>
	    		</tr>
    		</thead>
    		<tbody>
    			<c:forEach var="card" items="${cards}">
    				<tr>
    					<td>${card.cardType}</td>
    					<td>${card.number}</td>
    					<td>${card.customer.loginId}</td>
    					<td>${card.amount}</td>
    				</tr>
    			</c:forEach>
    		</tbody>
    	</table>
    	
    	<h2 class="text-success text-center">Transactions</h2>
    	<table class="table table-striped table-bordered table-hover" id="tableTransaction">
			<thead>
				<tr>
					<th>Account Number Source</th>
					<th>Account Number Target</th>
					<th>Owner Account Source</th>
					<th>Owner Account Target</th>
					<th>Bank</th>
					<th>Branch</th>
					<th>Amount</th>
					<th>Date</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${transactions}" var="transaction">
				<tr>
					<td>${transaction.accountNumberSource}</td>
					<td>${transaction.accountNumberTarget}</td>
					<td>${transaction.loginIdSource}</td>
					<td>${transaction.loginIdTarget}</td>
					<td>${transaction.targetBank}</td>
					<td>${transaction.targetBranch}</td>
					<td>${transaction.amount}</td>
					<td>${transaction.date.toString().substring(0,10)}</td>
				</tr>
				</c:forEach>
			</tbody>
		</table>
    	
     </div>
	  <div class="container"  style="padding-top: 50px;">
    	<div class="navbar navbar-default navbar-fixed-bottom">
    		<div class="container">
    			<p class="navbar-text">&copy; Hai Nguyen|Minh Nhut | Java Fresher</p>
    			<a href="#" class="navbar-btn btn btn-danger pull-right"><span class="glyphicon glyphicon-chevron-up"></span>Back To Top</a>
    		</div>
    	</div>
    </div>    
</body>
</html>